import React, { Component, Children } from 'react'
// Children

// Children.count  用来计数 (查看子元素的个数)
// Children.only  用来检测子元素是否为一个

// console.log(Children)

export default class Child extends Component {
    render() {
        const { children } = this.props
        // console.log(Children.only(children))
        return (
            <div>
                Child --- 
                {/* map(children, 回调) */}
                {/* 把 {} 给存放到一个数组中 */}
                {
                    Children.map(children, (item, index) => {
                        return <React.Fragment key={index}>
                            { item } --- { index }
                        </React.Fragment>
                    })
                }

                {/* {
                    children.map((item, index) => {
                        return <React.Fragment key={index}>
                            { item } { index }
                        </React.Fragment>
                    })
                } */}
            </div>
        )
    }
}
